import React, {Component} from 'react';
import {Redirect, Route} from "react-router-dom";
import {connect} from "react-redux";
import {Space, Spin} from 'antd';
import {getToken} from "../request/auth";
import {verifyAuthToken} from "../store/actions";

class AuthorizedRoute extends Component {

    componentWillMount() {
        const token = getToken();
        this.props.verifyAuthToken(token);

    }

    render() {

        const {component: Component, pending, logged, ...rest} = this.props;


        return (
            <Route {...rest} render={props => {
                if (pending) return <div style={{textAlign: "center", height: '100px'}}><Space size="middle"> <Spin
                    size="large"/> </Space></div>;
                return logged ? <Component {...props}/>
                    : <Redirect to="/login"/>
            }}>

            </Route>
        );
    }
}

const stateToProps = (state) => {

    return {
        ...state.user,
        ...state.app,
        ...state.authToken,
        // ...state.verifyAuthToken,
        // token: state.token,
        // logged: state.logged,
        // pending: state.pending,

    }
};


export default connect(stateToProps, {verifyAuthToken})(AuthorizedRoute);
